<template>
	<div class="emoji" v-if='isshow'>
		<img class='emi' @click='clickqq' v-for='item in imgs' :src="item" alt="" />
	</div>
</template>

<script type="text/ecmascript">
	export default {
		data() {
			return {
				imgs: []
			}
		},
		props:{
			isshow:Boolean
		},
		created() {
			this.addEmoji();
		},
		methods: {
			addEmoji() {
				var len = 84; //图表数量
				for(var i = 1; i <= len; i++) {
					this.imgs.push('/static/img/qq/' + i + '.png');
				}
			},
			clickqq(e){
				this.$emit('clickqq',e.target.src);
			}
		}
	}
</script>

<style lang='scss' scoped>
	@import "../assets/style/_mixin";
	.emoji {
		width: 100%;
		height: 380px/$ppr;
		background: #fff;
		transition: all .5s ease;
		overflow-y: auto;
		overflow-x: hidden;
		padding: 20px/$ppr 0;
		text-align: center;
		img{
			width:35px;
			height: 35px;
			margin-top: 10px;
		}
	}
</style>